<template>
    <div style="display: inline;">
        <div v-if="not isFollow" v-on:click="clickFollow" style="display:inline-block; width: 99px; height: 30px; background: url(Texture/Aries/Creator/keepwork/ggs/user/btn_add_guanzhudi_99X30_32bits.png#0 0 99 30);">
            <div valign="center" style="display:inline-block; margin-left: 18px; width: 30px; height: 15px; background: url(Texture/Aries/Creator/keepwork/ggs/user/zi_guanzhu_30X15_32bits.png#0 0 30 15);"></div>
        </div>
        <div v-if="isFollow" style="display: inline;">
            <div v-on:click="ShowCancelFollow" style="display:inline-block; width: 99px; height: 30px; background: url(Texture/Aries/Creator/keepwork/ggs/user/btn_guanzhudi_99X30_32bits.png#0 0 99 30);">
                <div valign="center" style="display:inline-block; margin-left:10px; width: 46px; height: 15px; background: url(Texture/Aries/Creator/keepwork/ggs/user/zi_yiguanzhu_46X15_32bits.png#0 0 46 15);"></div>
            </div>
            <div v-if="isShowCancelFollow" v-on:click="clickCancelFollow" style="width: 99px; height: 30px; background: url(Texture/Aries/Creator/keepwork/ggs/user/btn_quxiaoguanzhu_99X30_32bits.png#0 0 99 30);"></div>
        </div>
    </div>
</template>

<script type="text/lua">
self.isFollow = false;
self.isShowCancelFollow = false;

function OnRefresh()
    self.isFollow = UserDetail.isFollow or false;
end

function ShowCancelFollow()
    self.isShowCancelFollow = not self.isShowCancelFollow;
end

function clickFollow()
    if (not isLogin) then return end
    UserDetail.rank.fans = UserDetail.rank.fans + 1;
    UserDetail.isFollow = true;
    ui:RefreshWindow(0.01);
    keepwork.user.follow({
        objectType = 0,
        objectId = UserDetail.id,
    }, function(status, msg, data)
        -- self.fans = self.fans + 1;
    end);
end

function clickCancelFollow()
    if (not isLogin) then return end
    self.isShowCancelFollow = false;
    UserDetail.isFollow = false;
    UserDetail.rank.fans = UserDetail.rank.fans - 1;
    ui:RefreshWindow(0.01);

    keepwork.user.unfollow({
        objectType = 0,
        objectId = UserDetail.id,
    }, function(status, msg, data)
        -- self.fans = self.fans - 1;
    end);
end
</script>